﻿<Window x:Class="WOzTestUI.WizardWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:WOzTestUI"
    xmlns:WozLib="clr-namespace:WozLib;assembly=WozLib"
    xmlns:SketchProperty="clr-namespace:WozLib.UI.Ink.SketchProperties;assembly=WozLib"
    xmlns:WozLib-Ink="clr-namespace:WozLib.UI.Ink;assembly=WozLib"
    xmlns:WozLib-Containers="clr-namespace:WozLib.UI.Containers;assembly=WozLib"
    xmlns:WozLib_Controls="clr-namespace:WozLib.UI.Controls;assembly=WozLib"
    Title="Wizard's Workspace"
    Width="1200"
    Height="900" 
    x:Name="_WizardWindow"
    ResizeMode="CanResizeWithGrip"
    >
  <!--SizeToContent="WidthAndHeight"-->
  <Window.Resources>

    <!--<ResourceDictionary>
      <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source="MyApp.xaml"/>
      </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>-->
    
  </Window.Resources>
    <Grid>
      <DockPanel>

        <ToolBarTray Margin="2" DockPanel.Dock="Top">
          <ToolBar>
            <Button x:Name="SaveAsButton" Command="ApplicationCommands.SaveAs" 
                    Style="{StaticResource ToolBarButtonStyle}" >Save Workspace As</Button>
            <Button x:Name="OpenButton" Command="ApplicationCommands.Open"
                    Style="{StaticResource ToolBarButtonStyle}" >Open Workspace</Button>
            <Button x:Name="OpenFromImagesButton" Command="local:WizardWindow.OpenFromImagesCommand"
                    Style="{StaticResource ToolBarButtonStyle}" >Open From Images</Button>
            <Button x:Name="_ShowScratchPadButton"
                    Style="{StaticResource ToolBarButtonStyle}">Show Scratch Pad</Button>
          </ToolBar>
          
          <!--<ToolBar>
            <Button x:Name="UndoButton" Command="ApplicationCommands.Undo"
                    Style="{StaticResource ToolBarButtonStyle}" >Undo</Button>
            <Button x:Name="RedoButton" Command="ApplicationCommands.Redo"
                    Style="{StaticResource ToolBarButtonStyle}" >Redo</Button>
          </ToolBar>
          
          <ToolBar>
            <Button x:Name="MoveBackwardButton" Command="local:WizardWindow.MoveBackwardCommand"
                    Style="{StaticResource ToolBarButtonStyle}" >Move Backward</Button>
            <Button x:Name="MoveForwardButton" Command="local:WizardWindow.MoveForwardCommand"
                    Style="{StaticResource ToolBarButtonStyle}" >Move Forward</Button>
          </ToolBar>-->
          
        </ToolBarTray>

        <Grid Margin="1" DataContext="{Binding ElementName=_WizardWindow, Path=WozScreensProvider}">
          
          <Grid.ColumnDefinitions>
            <ColumnDefinition Width="200" />
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="*" />
          </Grid.ColumnDefinitions>

          <Grid.RowDefinitions>
            <RowDefinition Height="200"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
          </Grid.RowDefinitions>

          <!--Client Radar View-->
          <Border Grid.Row="0" Grid.Column="0" Margin="3 2 5 5" BorderBrush="Gray" BorderThickness="1" CornerRadius="5" Background="{StaticResource MajorControlBackground}">
            <Grid >
              <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="Auto"/>
              </Grid.RowDefinitions>
              <Grid x:Name="_ClientRadarGrid" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="3">
                <Grid.Background>
                  <VisualBrush Stretch="Uniform" Visual="{Binding ElementName=_WizardWindow, Path=ClientRadarCanvas}"/>
                </Grid.Background>

                <!--<ContentPresenter Content="{Binding ElementName=_WizardWindow, Path=ClientRadarCanvas}">
                  <ContentPresenter.RenderTransform>
                    <ScaleTransform ScaleX=""
                  </ContentPresenter.RenderTransform>
                </ContentPresenter>-->
                
              </Grid>
              <TextBlock Grid.Row="1" Margin="3" FontSize="12" FontWeight="SemiBold" HorizontalAlignment="Center">
                user's view
              </TextBlock>
            </Grid>
          </Border>
          <!--End Client Radar View-->

          <GridSplitter Grid.Row="1"
                        Grid.Column="0"
              Grid.ColumnSpan="1" 
              HorizontalAlignment="Stretch" 
              VerticalAlignment="Center"
              Height="4"
              ShowsPreview="True"
              Background="Transparent"
              />
          
          <!-- Screen List -->
          <Border Grid.Column="0" Grid.Row="2" Margin="3 2 5 5" BorderBrush="Gray" BorderThickness="1" CornerRadius="5" Background="{StaticResource MajorControlBackground}">
            <Grid>

              <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="Auto"/>
              </Grid.RowDefinitions>

              <!--<Grid Grid.Row="0">

              <TextBlock Grid.Row="0" HorizontalAlignment="Left" VerticalAlignment="Center">screens</TextBlock>

              <Button x:Name="_AddScreenButton" ClickMode="Press" Style="{StaticResource AddButtonStyleBlue}" VerticalAlignment="Center" HorizontalAlignment="Right" Margin="2" Opacity="0" Background="LightSkyBlue" Foreground="White" BorderBrush="Black">

                <Button.ToolTip>
                  <ToolTip>
                    <TextBlock>
                      add a new screen
                    </TextBlock>
                  </ToolTip>
                </Button.ToolTip>

                <Button.Triggers>
                  <EventTrigger RoutedEvent="Button.MouseEnter">
                    <EventTrigger.Actions>
                      <BeginStoryboard>
                        <Storyboard>
                          -->
              <!--This is a total hack because it relies on this happening after the mouse leave of the list below the button -->
              <!--
                          <DoubleAnimation
                            Storyboard.TargetProperty="Opacity" 
                            Storyboard.TargetName="_AddScreenButton" 
                            To="1.0" 
                            Duration="0:0:0"
                                />
                        </Storyboard>
                      </BeginStoryboard>
                    </EventTrigger.Actions>
                  </EventTrigger>
                </Button.Triggers>
              </Button>
              
            </Grid>-->

              <TextBlock Grid.Row="0"  Style="{StaticResource TextBoxLabel}">views</TextBlock>

              <StackPanel Grid.Row="2" HorizontalAlignment="Left" Orientation="Horizontal" Margin="3">
                <TextBlock VerticalAlignment="Center" FontFamily="Verdana" FontSize="12" Text="zoom "/>
                <TextBlock VerticalAlignment="Center" FontFamily="Verdana" FontSize="8">+</TextBlock>
                <Slider x:Name="ScreenListScale" VerticalAlignment="Center" Width="150" 
                        Orientation="Horizontal" Minimum="0.2" Maximum="2.5" Value="1.0" 
                  IsMoveToPointEnabled="False" LargeChange="0.1" IsDirectionReversed="True"></Slider>
                <TextBlock VerticalAlignment="Center" FontFamily="Verdana" FontSize="8">-</TextBlock>
              </StackPanel>

              <TabControl Grid.Row="1" TabStripPlacement="Bottom" Margin="3">
                <TabItem Header="list">
                  <Grid>


                    <WozLib-Containers:ReorderableListBox 
                      x:Name="_ScreensListBox"
                      ScrollViewer.HorizontalScrollBarVisibility="Disabled" 
                      ScrollViewer.VerticalScrollBarVisibility="Visible"
                      ScrollViewer.CanContentScroll="True"
                      Margin="2" 
                      IsSynchronizedWithCurrentItem="True" 
                      SelectedIndex="0"   
                      HorizontalAlignment="Stretch"
                      ItemsSource="{Binding}"
              >
                      <!--
              Background="AliceBlue"
              BorderThickness="0"
              -->
                      <ListBox.ItemTemplate>
                        <HierarchicalDataTemplate>
                          <!--MinWidth="100" MaxWidth="200"-->
                          <Grid x:Name="ItemGrid" ToolTip="{Binding Path=VisualToolTip}" 
                                Margin="4" HorizontalAlignment="Stretch">
                            <Grid.LayoutTransform>
                              <ScaleTransform ScaleX="{Binding ElementName=ScreenListScale, Path=Value}" ScaleY="{Binding ElementName=ScreenListScale, Path=Value}">
                              </ScaleTransform>
                            </Grid.LayoutTransform>
                            <Grid.Background>
                              <SolidColorBrush Color="LightSkyBlue" x:Name="ItemGridBackground" />
                            </Grid.Background>
                            <Grid.ColumnDefinitions>
                              <ColumnDefinition Width="*"/>
                              <ColumnDefinition Width="Auto"/>
                            </Grid.ColumnDefinitions>
                            <!--MaxWidth="300"-->
                            <TextBlock TextWrapping="Wrap" HorizontalAlignment="Stretch" Grid.Column="0" VerticalAlignment="Center" Margin="4" FontFamily="Verdana" Text="{Binding Path=Description}"/>
                            <Rectangle Grid.Column="1" Margin="3" RadiusX="4" RadiusY="4" StrokeThickness="1" Stroke="Black" Width="35" Height="35">
                              <Rectangle.Fill>
                                <VisualBrush Visual="{Binding}"/>
                              </Rectangle.Fill>
                            </Rectangle>
                            <Grid.Triggers>
                              <EventTrigger RoutedEvent="Grid.MouseEnter">
                                <EventTrigger.Actions>
                                  <BeginStoryboard>
                                    <Storyboard>
                                      <ColorAnimation 
                                        Storyboard.TargetProperty="Color" 
                                        Storyboard.TargetName="ItemGridBackground" 
                                        Duration="0:0:0.1"
                                >
                                        <ColorAnimation.To>
                                          <!--To="LightSalmon"-->
                                          <!--R:214  G:217  B:229=""-->
                                          <!--I don't know why it says Color is invalid here, but it is valid and will run fine-->
                                          <Color A="255" R="214" G="217" B="229" />
                                        </ColorAnimation.To>
                                      </ColorAnimation>
                                    </Storyboard>
                                  </BeginStoryboard>
                                </EventTrigger.Actions>
                              </EventTrigger>
                              <EventTrigger RoutedEvent="Grid.MouseLeave">
                                <EventTrigger.Actions>
                                  <BeginStoryboard>
                                    <Storyboard>
                                      <ColorAnimation 
                                        Storyboard.TargetProperty="Color" 
                                        Storyboard.TargetName="ItemGridBackground" 
                                        To="LightSkyBlue" 
                                        Duration="0:0:0.3"
                                />
                                    </Storyboard>
                                  </BeginStoryboard>
                                </EventTrigger.Actions>
                              </EventTrigger>
                            </Grid.Triggers>
                          </Grid>
                        </HierarchicalDataTemplate>
                      </ListBox.ItemTemplate>

                      <ListBox.Triggers>
                        <EventTrigger RoutedEvent="ListBox.MouseEnter">
                          <EventTrigger.Actions>
                            <BeginStoryboard>
                              <Storyboard>
                                <DoubleAnimation
                                  Storyboard.TargetProperty="Opacity" 
                                  Storyboard.TargetName="_AddScreenButton" 
                                  To="1.0" 
                                  Duration="0:0:0"
                                />
                              </Storyboard>
                            </BeginStoryboard>
                          </EventTrigger.Actions>
                        </EventTrigger>
                        <EventTrigger RoutedEvent="ListBox.MouseLeave">
                          <EventTrigger.Actions>
                            <BeginStoryboard>
                              <Storyboard>
                                <DoubleAnimation 
                                  Storyboard.TargetProperty="Opacity" 
                                  Storyboard.TargetName="_AddScreenButton" 
                                  To="0.0" 
                                  Duration="0:0:0.3"
                                />
                              </Storyboard>
                            </BeginStoryboard>
                          </EventTrigger.Actions>
                        </EventTrigger>
                      </ListBox.Triggers>

                    </WozLib-Containers:ReorderableListBox>

                    <Button x:Name="_AddScreenButton" ClickMode="Press" Style="{StaticResource AddButtonStyleBlue}" VerticalAlignment="Bottom" HorizontalAlignment="Left" Margin="6" Opacity="0" Background="LightSkyBlue" Foreground="White" BorderBrush="Black">

                      <Button.ToolTip>
                        <ToolTip>
                          <TextBlock>
                            add a new screen
                          </TextBlock>
                        </ToolTip>
                      </Button.ToolTip>

                      <Button.Triggers>
                        <EventTrigger RoutedEvent="Button.MouseEnter">
                          <EventTrigger.Actions>
                            <BeginStoryboard>
                              <Storyboard>
                                <!--This is a total hack because it relies on this happening after the mouse leave of the list below the button -->
                                <DoubleAnimation
                                  Storyboard.TargetProperty="Opacity" 
                                  Storyboard.TargetName="_AddScreenButton" 
                                  To="1.0" 
                                  Duration="0:0:0"
                                />
                              </Storyboard>
                            </BeginStoryboard>
                          </EventTrigger.Actions>
                        </EventTrigger>
                      </Button.Triggers>
                    </Button>


                  </Grid>
                </TabItem>

                <TabItem  Header="grid">
                  <Grid>

                    <ListBox  
                      x:Name="_ScreensListBox2"
                      ScrollViewer.HorizontalScrollBarVisibility="Disabled" 
                      ScrollViewer.VerticalScrollBarVisibility="Visible"
                      ScrollViewer.CanContentScroll="True"
                      Margin="2" 
                      IsSynchronizedWithCurrentItem="True" 
                      SelectedIndex="0"   
                      HorizontalAlignment="Stretch"
                      ItemsSource="{Binding}"
              >
                      <!--
              Background="AliceBlue"
              BorderThickness="0"
              -->
                      <ListBox.ItemsPanel>
                        <ItemsPanelTemplate>
                          <WrapPanel HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
                                     FlowDirection="LeftToRight"
                                   >

                          </WrapPanel>
                        </ItemsPanelTemplate>
                      </ListBox.ItemsPanel>

                      <ListBox.ItemTemplate>

                        <HierarchicalDataTemplate>

                          <Grid x:Name="ItemGrid" ToolTip="{Binding Path=VisualToolTip}" Margin="4">
                            <Grid.LayoutTransform>
                              <ScaleTransform ScaleX="{Binding ElementName=ScreenListScale, Path=Value}" ScaleY="{Binding ElementName=ScreenListScale, Path=Value}">
                              </ScaleTransform>
                            </Grid.LayoutTransform>
                            <Grid.Background>
                              <SolidColorBrush Color="LightSkyBlue" x:Name="ItemGridBackground" />
                            </Grid.Background>
                            <Grid.RowDefinitions>
                              <RowDefinition Height="Auto"/>
                              <RowDefinition Height="Auto"/>
                            </Grid.RowDefinitions>

                            <!--MaxWidth="300"-->
                            <!--RadiusX="4" RadiusY="4"
                          StrokeThickness="1" Stroke="Black"-->
                            <Rectangle Grid.Row="0" Margin="3" Width="100" Height="80">
                              <Rectangle.Fill>
                                <VisualBrush Visual="{Binding}" Stretch="Uniform"/>
                              </Rectangle.Fill>
                            </Rectangle>

                            <TextBlock TextWrapping="Wrap" HorizontalAlignment="Stretch" 
                                       Grid.Row="1" VerticalAlignment="Center" 
                              Margin="4" FontFamily="Verdana" FontSize="10" Text="{Binding Path=Description}"/>

                            <Grid.Triggers>
                              <EventTrigger RoutedEvent="Grid.MouseEnter">
                                <EventTrigger.Actions>
                                  <BeginStoryboard>
                                    <Storyboard>
                                      <ColorAnimation 
                                        Storyboard.TargetProperty="Color" 
                                        Storyboard.TargetName="ItemGridBackground" 
                                        Duration="0:0:0.1"
                                >
                                        <ColorAnimation.To>
                                          <!--To="LightSalmon"-->
                                          <!--R:214  G:217  B:229=""-->
                                          <!--I don't know why it says Color is invalid here, but it is valid and will run fine-->
                                          <Color A="255" R="214" G="217" B="229" />
                                        </ColorAnimation.To>
                                      </ColorAnimation>
                                    </Storyboard>
                                  </BeginStoryboard>
                                </EventTrigger.Actions>
                              </EventTrigger>
                              <EventTrigger RoutedEvent="Grid.MouseLeave">
                                <EventTrigger.Actions>
                                  <BeginStoryboard>
                                    <Storyboard>
                                      <ColorAnimation 
                                        Storyboard.TargetProperty="Color" 
                                        Storyboard.TargetName="ItemGridBackground" 
                                        To="LightSkyBlue" 
                                        Duration="0:0:0.3"
                                />
                                    </Storyboard>
                                  </BeginStoryboard>
                                </EventTrigger.Actions>
                              </EventTrigger>
                            </Grid.Triggers>

                          </Grid>

                        </HierarchicalDataTemplate>
                      </ListBox.ItemTemplate>

                      <ListBox.Triggers>
                        <EventTrigger RoutedEvent="ListBox.MouseEnter">
                          <EventTrigger.Actions>
                            <BeginStoryboard>
                              <Storyboard>
                                <DoubleAnimation
                                  Storyboard.TargetProperty="Opacity" 
                                  Storyboard.TargetName="_AddScreenButton2" 
                                  To="1.0" 
                                  Duration="0:0:0"
                                />
                              </Storyboard>
                            </BeginStoryboard>
                          </EventTrigger.Actions>
                        </EventTrigger>
                        <EventTrigger RoutedEvent="ListBox.MouseLeave">
                          <EventTrigger.Actions>
                            <BeginStoryboard>
                              <Storyboard>
                                <DoubleAnimation 
                                  Storyboard.TargetProperty="Opacity" 
                                  Storyboard.TargetName="_AddScreenButton2" 
                                  To="0.0" 
                                  Duration="0:0:0.3"
                                />
                              </Storyboard>
                            </BeginStoryboard>
                          </EventTrigger.Actions>
                        </EventTrigger>
                      </ListBox.Triggers>

                    </ListBox >

                    <Button x:Name="_AddScreenButton2" ClickMode="Press" Style="{StaticResource AddButtonStyleBlue}" VerticalAlignment="Bottom" HorizontalAlignment="Left" Margin="6" Opacity="0" Background="LightSkyBlue" Foreground="White" BorderBrush="Black">

                      <Button.ToolTip>
                        <ToolTip>
                          <TextBlock>
                            add a new view
                          </TextBlock>
                        </ToolTip>
                      </Button.ToolTip>

                      <Button.Triggers>
                        <EventTrigger RoutedEvent="Button.MouseEnter">
                          <EventTrigger.Actions>
                            <BeginStoryboard>
                              <Storyboard>
                                <!--This is a total hack because it relies on this happening after the mouse leave of the list below the button -->
                                <DoubleAnimation
                                  Storyboard.TargetProperty="Opacity" 
                                  Storyboard.TargetName="_AddScreenButton2" 
                                  To="1.0" 
                                  Duration="0:0:0"
                                />
                              </Storyboard>
                            </BeginStoryboard>
                          </EventTrigger.Actions>
                        </EventTrigger>
                      </Button.Triggers>
                    </Button>


                  </Grid>
                </TabItem>
              </TabControl>

            </Grid>
          </Border>
          <!-- end Screen List -->
          
          <GridSplitter Grid.Column="1" 
              Grid.RowSpan="3" 
              Grid.Row="0"
              HorizontalAlignment="Center" 
              VerticalAlignment="Stretch"
              Width="4"
              ShowsPreview="True"
              Background="Transparent"
              />

          <Grid Grid.Column="2" Grid.Row="0" Grid.RowSpan="3">
            <Grid.RowDefinitions>
              <RowDefinition Height="Auto"/>
              <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
              <ColumnDefinition Width="Auto"/>
              <ColumnDefinition Width="*"/>
              <ColumnDefinition Width="Auto"/>
              <ColumnDefinition Width="250"/>
            </Grid.ColumnDefinitions>

            <!--commiting controls-->
            <StackPanel Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2" Orientation="Horizontal" Margin="1">
              <TextBlock  Margin="0 0 2 0"  FontWeight="SemiBold" TextAlignment="Left" VerticalAlignment="Center">
                Wizard's Changes:
              </TextBlock>
              <Button x:Name="CommitButton"
                      Margin="2" Padding="4 0 4 0">
                Commit Changes
              </Button>
              <Button x:Name="DiscardButton" Command="local:WizardWindow.DiscardChangesCommand"
                      Margin="2" Padding="4 0 4 0">
                Discard Changes
              </Button>
              <TextBlock Visibility="Collapsed" Margin="5 0 2 0" FontWeight="SemiBold" TextAlignment="Left" VerticalAlignment="Center">
                Mode:
              </TextBlock>
              <!--this is really the automatically commit mode
              but since we don't have that implemented right now
              we just have one mode called realtime-->
              <CheckBox Margin="2 0 2 0" x:Name="AutoCommitCheck" IsChecked="False" VerticalAlignment="Center">
                <!--Automatically Commit-->
                Real Time Mode
              </CheckBox>
              <CheckBox Visibility="Collapsed" Margin="2 0 2 0" x:Name="RealTimeCheck" IsChecked="False" VerticalAlignment="Center">
                Real Time Mode
              </CheckBox>
            </StackPanel>
            <!--end commiting controls-->

            <!--wizards tool-->
            <ToolBarTray Grid.Row="1" Grid.Column="0" Orientation="Vertical" Background="White"
                         Margin="0 0 3 0">
              
              <!--ink canvas editing modes-->
              <WozLib_Controls:ToolSelectToolbar x:Name="_ToolSelectToolbar"/>
              
              <!--application commands-->
              <ToolBar>
                <ToolBar.Template>
                  <ControlTemplate TargetType="{x:Type ToolBar}">
                    <Border BorderBrush="Gray" BorderThickness="1" CornerRadius="5" Margin="0 10 0 0" Background="{StaticResource MajorControlBackground}">
                      <ItemsPresenter/>
                    </Border>
                  </ControlTemplate>
                </ToolBar.Template>
                <ToolBar.ItemsPanel>
                  <ItemsPanelTemplate>
                    <StackPanel Margin="2" Orientation="{Binding ElementName=_ToolBar, Path=Orientation}" />
                  </ItemsPanelTemplate>
                </ToolBar.ItemsPanel>
                <ToolBar.Resources>
                  <Style TargetType="Button" x:Key="ButtonStyle">
                    <Setter Property="HorizontalAlignment" Value="Left"/>
                  </Style>
                  <Style TargetType="{x:Type Canvas}">
                    <Setter Property="Width" Value="12"/>
                    <Setter Property="Height" Value="12"/>
                    <Setter Property="Margin" Value="0 0 3 0"/>
                  </Style>
                </ToolBar.Resources>

                <!--heading-->
                <!--<TextBlock Margin="17 5 0 0" TextAlignment="Left" FontWeight="SemiBold">commands</TextBlock>-->

                <!--list of commands-->
                <Button x:Name="UndoButton" Command="ApplicationCommands.Undo"
                Style="{StaticResource ButtonStyle}" >
                  <StackPanel Orientation="Horizontal">
                    <Canvas>
                      <Path Data="M 7,12 C 12,6 8,0 2,7" Stroke="sc#1, 0.2725, 0.3353, 0.7882" StrokeThickness="2"/>
                      <Polygon Points="0,9 0,3 6,9" Fill="sc#1, 0.2725, 0.3353, 0.7882"/>
                    </Canvas>
                    <TextBlock Text="undo"/>
                  </StackPanel>
                </Button>

                <Button x:Name="RedoButton" Command="ApplicationCommands.Redo"
                        Style="{StaticResource ButtonStyle}" >
                  <StackPanel Orientation="Horizontal">
                    <Canvas>
                      <Path Data="M 5,12 C 0,6 4,0 10,7" Stroke="sc#1, 0.2725, 0.3353, 0.7882" StrokeThickness="2"/>
                      <Polygon Points="12,9 12,3 6,9" Fill="sc#1, 0.2725, 0.3353, 0.7882"/>
                    </Canvas>
                    <TextBlock Text="redo"/>
                  </StackPanel>
                </Button>

                <Button x:Name="CutButton" Command="ApplicationCommands.Cut"
                        Style="{StaticResource ButtonStyle}" >
                  <StackPanel Orientation="Horizontal">
                    <Canvas ClipToBounds="True">

                      <Ellipse Width="5" Height="7" Stroke="DarkBlue" StrokeThickness="1.5" Fill="Transparent" Canvas.Top="5" Canvas.Left="1">
                        <Ellipse.LayoutTransform>
                          <RotateTransform CenterX="2.5" CenterY="3" Angle="20"/>
                        </Ellipse.LayoutTransform>
                      </Ellipse>

                      <Ellipse Width="4" Height="6" Stroke="DarkBlue" StrokeThickness="1.5" Fill="Transparent" Canvas.Top="5" Canvas.Left="6">
                        <Ellipse.LayoutTransform>
                          <RotateTransform CenterX="2.5" CenterY="3" Angle="-15"/>
                        </Ellipse.LayoutTransform>
                      </Ellipse>

                      <Polygon Points="5,5 6,6 9,1" StrokeThickness="1" Fill="DarkGray" Stroke="DarkGray"/>
                      <Polygon Points="7,4 6,6 1,1" StrokeThickness="1" Fill="DarkGray" Stroke="DarkGray"/>

                    </Canvas>
                    <TextBlock Text="cut"/>
                  </StackPanel>
                </Button>

                <Button x:Name="CopyButton" Command="ApplicationCommands.Copy"
                        Style="{StaticResource ButtonStyle}" >
                  <StackPanel Orientation="Horizontal">
                    <Canvas>
                      <Rectangle Stroke="Gray" Fill="White" Width="8" Height="9"/>
                      <Line X1="1.5" X2="6.5" Y1="2.5" Y2="2.5" Stroke="Blue" StrokeThickness="0.5" />
                      <Line X1="1.5" X2="6.5" Y1="4.5" Y2="4.5" Stroke="Blue" StrokeThickness="0.5" />
                      <Line X1="1.5" X2="6.5" Y1="6.5" Y2="6.5" Stroke="Blue" StrokeThickness="0.5" />

                      <Rectangle Stroke="Gray" Fill="White" Width="8" Height="9" Canvas.Left="4" Canvas.Top="3"/>
                      <Line X1="5.5" X2="10.5" Y1="5.5" Y2="5.5" Stroke="Blue" StrokeThickness="0.5" />
                      <Line X1="5.5" X2="10.5" Y1="7.5" Y2="7.5" Stroke="Blue" StrokeThickness="0.5" />
                      <Line X1="5.5" X2="10.5" Y1="9.5" Y2="9.5" Stroke="Blue" StrokeThickness="0.5" />
                    </Canvas>
                    <TextBlock Text="copy"/>
                  </StackPanel>
                </Button>

                <Button x:Name="PasteButton" Command="ApplicationCommands.Paste"
                        Style="{StaticResource ButtonStyle}" >
                  <StackPanel Orientation="Horizontal">
                    <Canvas>

                      <Rectangle Canvas.Top="1" Stroke="Gray" StrokeThickness="1" Width="12" Height="11" RadiusX="2" RadiusY="2">
                        <Rectangle.Fill>
                          <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
                            <GradientStop Color="Yellow" Offset="0.15"/>
                            <GradientStop Color="Orange" Offset="0.75"/>
                          </LinearGradientBrush>
                        </Rectangle.Fill>
                      </Rectangle>

                      <Ellipse Fill="Gold" Stroke="Gray" StrokeThickness="1" Width="5" Height="5" Canvas.Top="0" Canvas.Left="3.5"/>
                      <Ellipse Fill="Gray" StrokeThickness="0" Width="1" Height="1" Canvas.Top="2" Canvas.Left="5.5"/>
                      <Line X1="2" X2="10" Y1="4.5" Y2="4.5" Stroke="Gray" StrokeThickness="1" />

                      <Rectangle Stroke="Gray" Fill="White" Width="8" Height="6" Canvas.Left="4" Canvas.Top="6"/>
                      <Line X1="5.5" X2="10.5" Y1="7.5" Y2="7.5" Stroke="Blue" StrokeThickness="0.5" />
                      <Line X1="5.5" X2="10.5" Y1="9.5" Y2="9.5" Stroke="Blue" StrokeThickness="0.5" />

                    </Canvas>
                    <TextBlock Text="paste"/>
                  </StackPanel>
                </Button>

                <Button x:Name="MoveBackwardButton" Command="local:WizardWindow.MoveBackwardCommand"
                        Style="{StaticResource ButtonStyle}" >
                  <StackPanel Orientation="Horizontal">
                    <Canvas>
                      <Polygon Points="2,10 10,10 10,12 2,12" Stroke="Gray" Fill="sc#1, 0.2725, 0.3353, 0.7882" StrokeThickness="0"/>
                      <Polygon Points="2,10 10,10 7,5 11,5 6,0 1,5 5,5 " Stroke="Gray" StrokeThickness="0.5">
                        <Polygon.Fill>
                          <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1" >
                            <LinearGradientBrush.GradientStops>
                              <GradientStop Color="AliceBlue" Offset="0" />
                              <GradientStop Color="sc#1, 0.2725, 0.3353, 0.7882" Offset="1" />
                            </LinearGradientBrush.GradientStops>
                          </LinearGradientBrush>
                        </Polygon.Fill>
                      </Polygon>
                    </Canvas>
                    <TextBlock Text="backward"/>
                  </StackPanel>
                </Button>

                <Button x:Name="MoveForwardButton" Command="local:WizardWindow.MoveForwardCommand"
                        Style="{StaticResource ButtonStyle}" >
                  <StackPanel Orientation="Horizontal">
                    <Canvas>
                      <Polygon Points="1,7 6,12 11,7 11,5 6,10 1,5 " Stroke="Gray" Fill="sc#1, 0.2725, 0.3353, 0.7882" StrokeThickness="0"/>
                      <Polygon Points="5,0 7,0 9,5 11,5 6,10 1,5 3,5 " Stroke="Gray" StrokeThickness="0.5">
                        <Polygon.Fill>
                          <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1" >
                            <LinearGradientBrush.GradientStops>
                              <GradientStop Color="AliceBlue" Offset="0" />
                              <GradientStop Color="sc#1, 0.2725, 0.3353, 0.7882" Offset="1" />
                            </LinearGradientBrush.GradientStops>
                          </LinearGradientBrush>
                        </Polygon.Fill>
                      </Polygon>
                    </Canvas>
                    <TextBlock Text="forward"/>
                  </StackPanel>
                </Button>

              </ToolBar>
            </ToolBarTray>
            <!--end wizards tool-->

            <!--selected screen-->
            <ContentControl Grid.Row="1" Grid.Column="1" x:Name="_SelectedScreenContentControl" Content="{Binding Path=/}">
              <ContentControl.ContentTemplate>
                <HierarchicalDataTemplate>

                  <Grid>

                    <Grid.ColumnDefinitions>
                      <ColumnDefinition Width="*"/>
                      <ColumnDefinition Width="Auto"/>
                      <ColumnDefinition Width="250"/>
                    </Grid.ColumnDefinitions>

                    <Border Grid.Row="0" Margin="0 2 2 5" BorderBrush="Gray" BorderThickness="1" CornerRadius="5" Background="{StaticResource MajorControlBackground}">
                      <Grid>
                        <Grid.RowDefinitions>
                          <RowDefinition Height="Auto"/>
                          <RowDefinition Height="*"/>
                        </Grid.RowDefinitions>

                        <StackPanel Grid.Row="0" Orientation="Horizontal" HorizontalAlignment="Left">
                          <TextBlock Style="{StaticResource TextBoxLabel}">view name:</TextBlock>
                          <TextBox Text="{Binding Path=Description, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
                                   Style="{StaticResource ScreenProperyTextBox}"
                                   PreviewMouseDown="_TextBox_SelectAll_PreviewMouseDown"
                                   GotFocus="_TextBox_SelectAll_GotFocus"
                                       />

                          <TextBlock Style="{StaticResource TextBoxLabel}">view ID:</TextBlock>
                          <TextBlock  Style="{StaticResource TextBoxLabel}" Text="{Binding Path=ServerID}"/>

                          

                          <TextBlock Style="{StaticResource TextBoxLabel}" >width:</TextBlock>
                          <TextBox Text="{Binding Path=Width, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged }"
                                   Style="{StaticResource ScreenProperyTextBox}"
                                   PreviewMouseDown="_TextBox_SelectAll_PreviewMouseDown"
                                   GotFocus="_TextBox_SelectAll_GotFocus"
                                       />

                          <TextBlock Style="{StaticResource TextBoxLabel}">height:</TextBlock>
                          <TextBox Text="{Binding Path=Height, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged }"
                                   Style="{StaticResource ScreenProperyTextBox}"
                                   PreviewMouseDown="_TextBox_SelectAll_PreviewMouseDown"
                                   GotFocus="_TextBox_SelectAll_GotFocus"
                                       />

                          <TextBlock Style="{StaticResource TextBoxLabel}">user tool:</TextBlock>
                          <WozLib_Controls:ToolSelectComboBox x:Name="_ToolSelectComboBox"
                                                              SketchPad="{Binding}"/>

                        </StackPanel>

                        <ScrollViewer Grid.Row="1" HorizontalScrollBarVisibility="Visible"
                                      CanContentScroll="True"
                          VerticalScrollBarVisibility="Auto"
                          Margin="3"
                          x:Name="_SelectedScreenScroller"
                            >
                          <!--<Border Grid.Column="0" BorderBrush="Gray"  BorderThickness="1" Margin="2" >-->
                          <ContentControl Content="{Binding}" HorizontalAlignment="Left"
                            VerticalAlignment="Top" HorizontalContentAlignment="Left"
                            VerticalContentAlignment="Top" Background="White" >
                            <ContentControl.LayoutTransform>
                              <ScaleTransform ScaleX="{Binding ElementName=SelectedScreenScale, Path=Value}" ScaleY="{Binding ElementName=SelectedScreenScale, Path=Value}">
                              </ScaleTransform>
                            </ContentControl.LayoutTransform>
                          </ContentControl>
                          <!--</Border>-->
                        </ScrollViewer>

                      </Grid>
                    </Border>

                    <GridSplitter Grid.Column="1"
                      Grid.RowSpan="1"
                      HorizontalAlignment="Center"
                      VerticalAlignment="Stretch"
                      Width="4"
                      ShowsPreview="True"
                      Background="Transparent"
                          />

                    <!--property window on the right-->

                    <Grid Grid.Column="2">
                      <Grid.RowDefinitions>
                        <RowDefinition Height="175"/>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="*"/>
                      </Grid.RowDefinitions>

                      <Border Grid.Row="0" Margin="0 2 5 5" BorderBrush="Gray" BorderThickness="1" CornerRadius="5" Background="{StaticResource MajorControlBackground}">
                        <Grid >
                          <Grid.RowDefinitions>
                            <RowDefinition Height="*"/>
                            <RowDefinition Height="Auto"/>
                          </Grid.RowDefinitions>
                          <Grid Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="3">

                            <WozLib_Controls:ScrollNavigator ScrollViewer="{Binding ElementName=_SelectedScreenScroller}" />

                            <!--<Rectangle Margin="5" Opacity="1.0" RadiusX="15" RadiusY="15">

                                  <Rectangle.Fill>
                                    <VisualBrush Stretch="Uniform" Visual="{Binding ElementName=_SelectedScreenScroller, Path=Content}"/>
                                  </Rectangle.Fill>
                                  
                                </Rectangle>-->

                          </Grid>
                          <StackPanel Grid.Row="1" Orientation="Horizontal" Margin="3">
                            <TextBlock VerticalAlignment="Center" FontFamily="Verdana" FontSize="12">zoom</TextBlock>
                            <TextBlock VerticalAlignment="Center" FontFamily="Verdana" FontSize="8">+</TextBlock>
                            <Slider x:Name="SelectedScreenScale" VerticalAlignment="Center" Width="150"
                                    Orientation="Horizontal" Minimum="0.2" Maximum="2.5" Value="1.0"
                              IsMoveToPointEnabled="False" LargeChange="0.1" IsDirectionReversed="True"></Slider>
                            <TextBlock VerticalAlignment="Center" FontFamily="Verdana" FontSize="8">-</TextBlock>
                          </StackPanel>
                        </Grid>
                      </Border>

                      <GridSplitter Grid.Row="1"
                                    Grid.ColumnSpan="1"
                      HorizontalAlignment="Stretch"
                      VerticalAlignment="Center"
                      Height="4"
                      ShowsPreview="True"
                      Background="Transparent"
                          />

                      <Border Grid.Row="2" Margin="0 2 5 5"  BorderBrush="Gray" BorderThickness="1" CornerRadius="5" Background="{StaticResource MajorControlBackground}">
                        <Grid  >
                          <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="*"/>
                            <RowDefinition Height="Auto"/>
                          </Grid.RowDefinitions>

                          <TextBlock Grid.Row="0" Style="{StaticResource TextBoxLabel}">selected item(s) properties</TextBlock>

                          <!--MinWidth="200"-->
                          <ListBox x:Name="_PropertiesListBox"
                              Margin="3"
                              ItemsSource="{Binding Path=SelectWozObjectCascadingProperties}"
                              
                              Grid.Row="1"
                              HorizontalAlignment="Stretch"
                              ScrollViewer.HorizontalScrollBarVisibility="Visible"
                              ScrollViewer.VerticalScrollBarVisibility="Auto"
                              ScrollViewer.CanContentScroll="True"
                            >
                            <ListBox.ItemTemplate>
                              <HierarchicalDataTemplate>
                                <Grid>
                                  <Grid.LayoutTransform>
                                    <ScaleTransform ScaleX="{Binding ElementName=PropertyScale, Path=Value}" ScaleY="{Binding ElementName=PropertyScale, Path=Value}">
                                    </ScaleTransform>
                                  </Grid.LayoutTransform>
                                  <ContentPresenter Content="{Binding}"/>
                                </Grid>
                              </HierarchicalDataTemplate>
                            </ListBox.ItemTemplate>
                          </ListBox>

                          <StackPanel Grid.Row="2" HorizontalAlignment="Left" Orientation="Horizontal" Margin="3">
                            <TextBlock VerticalAlignment="Center" FontFamily="Verdana" FontSize="12" Text="zoom "/>
                            <TextBlock VerticalAlignment="Center" FontFamily="Verdana" FontSize="8">+</TextBlock>
                            <Slider x:Name="PropertyScale" VerticalAlignment="Center" Width="150"
                                    Orientation="Horizontal" Minimum="0.2" Maximum="2.5" Value="1.0"
                              IsMoveToPointEnabled="False" LargeChange="0.1" IsDirectionReversed="True"></Slider>
                            <TextBlock VerticalAlignment="Center" FontFamily="Verdana" FontSize="8">-</TextBlock>
                          </StackPanel>

                        </Grid>
                      </Border>
                      <!-- end properties panel -->

                    </Grid>
                    <!-- end left panel-->

                  </Grid>
                </HierarchicalDataTemplate>
              </ContentControl.ContentTemplate>
            </ContentControl>
            <!--end selected screen-->

            <GridSplitter Grid.Column="2"
              Grid.RowSpan="3"
              Grid.Row="0"
              HorizontalAlignment="Center"
              VerticalAlignment="Stretch"
              Width="4"
              ShowsPreview="True"
              Background="Transparent"
              />

            <Grid Grid.Column="3" Grid.Row="2">
              <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
              </Grid.RowDefinitions>

              <!-- Replacement List -->
              <Border Grid.Row="0" Margin="3 2 5 5" BorderBrush="Gray"
                      BorderThickness="1" CornerRadius="5" Background="{StaticResource MajorControlBackground}">
                <Grid DataContext="{Binding ElementName=_WizardWindow, Path=ReplacementPadsProvider}" >

                  <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="*"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                  </Grid.RowDefinitions>

                  <TextBlock Grid.Row="0" Margin="3" FontFamily="Verdana" FontSize="14" FontWeight="SemiBold">
                    paste buttons:
                  </TextBlock>

                  <StackPanel Grid.Row="2" Margin="3" HorizontalAlignment="Left" Orientation="Horizontal">
                    <TextBlock VerticalAlignment="Center" FontFamily="Verdana" FontSize="12" Text="zoom "/>
                    <TextBlock VerticalAlignment="Center" FontFamily="Verdana" FontSize="8">+</TextBlock>
                    <Slider x:Name="ReplacementListScale" VerticalAlignment="Center" Width="150"
                            Orientation="Horizontal" Minimum="0.2" Maximum="2.5" Value="1.0"
                      IsMoveToPointEnabled="False" LargeChange="0.1" IsDirectionReversed="True"></Slider>
                    <TextBlock VerticalAlignment="Center" FontFamily="Verdana" FontSize="8">-</TextBlock>
                  </StackPanel>

                  <Button Grid.Row="3" Margin="3" MinHeight="60"  x:Name="_AddReplacementPadFromClipboardButton"
                          Click="AddReplacementPadFromClipboardButton_Click">
                    <TextBlock Style="{StaticResource TextBoxLabel}">add from clipboard</TextBlock>
                    
                  </Button>

                  <Grid Grid.Row="1" Margin="3">

                    <ListBox
                      x:Name="_ReplacementListBox"
                      ScrollViewer.HorizontalScrollBarVisibility="Disabled"
                      ScrollViewer.VerticalScrollBarVisibility="Visible"
                      ScrollViewer.CanContentScroll="True"
                      Margin="2"
                      IsSynchronizedWithCurrentItem="True"
                      SelectedIndex="0"
                      HorizontalAlignment="Stretch"
                      ItemsSource="{Binding}"
              >
                      <ListBox.ItemsPanel>
                        <ItemsPanelTemplate>
                          <WrapPanel HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
                                     FlowDirection="LeftToRight"
                                   >

                          </WrapPanel>
                        </ItemsPanelTemplate>
                      </ListBox.ItemsPanel>

                      <ListBox.ItemTemplate>

                        <HierarchicalDataTemplate>

                          <Button Click="ReplacementPadButton_Click" Tag="{Binding}">

                            <Grid x:Name="ItemGrid" ToolTip="{Binding Path=VisualToolTip}" Margin="4">
                              <Grid.LayoutTransform>
                                <ScaleTransform ScaleX="{Binding ElementName=ReplacementListScale, Path=Value}" ScaleY="{Binding ElementName=ReplacementListScale, Path=Value}">
                                </ScaleTransform>
                              </Grid.LayoutTransform>
                              <Grid.Background>
                                <SolidColorBrush Color="LightSkyBlue" x:Name="ItemGridBackground" />
                              </Grid.Background>
                              <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                              </Grid.RowDefinitions>



                              <Rectangle Grid.Row="0" Margin="3" Width="100" Height="80">
                                <Rectangle.Fill>
                                  <VisualBrush Visual="{Binding}" Stretch="Uniform"/>
                                </Rectangle.Fill>
                              </Rectangle>

                              <TextBlock TextWrapping="Wrap" HorizontalAlignment="Stretch"
                                         Grid.Row="1" VerticalAlignment="Center"
                                Margin="4" FontFamily="Verdana" FontSize="10" Text="{Binding Path=Description}"/>


                              <Grid.Triggers>
                                <EventTrigger RoutedEvent="Grid.MouseEnter">
                                  <EventTrigger.Actions>
                                    <BeginStoryboard>
                                      <Storyboard>
                                        <ColorAnimation
                                          Storyboard.TargetProperty="Color"
                                          Storyboard.TargetName="ItemGridBackground"
                                          Duration="0:0:0.1"
                                >
                                          <ColorAnimation.To>
                                            <!--To="LightSalmon"-->
                                            <!--R:214  G:217  B:229=""-->
                                            <!--I don't know why it says Color is invalid here, but it is valid and will run fine-->
                                            <Color A="255" R="214" G="217" B="229" />
                                          </ColorAnimation.To>
                                        </ColorAnimation>
                                      </Storyboard>
                                    </BeginStoryboard>
                                  </EventTrigger.Actions>
                                </EventTrigger>
                                <EventTrigger RoutedEvent="Grid.MouseLeave">
                                  <EventTrigger.Actions>
                                    <BeginStoryboard>
                                      <Storyboard>
                                        <ColorAnimation
                                          Storyboard.TargetProperty="Color"
                                          Storyboard.TargetName="ItemGridBackground"
                                          To="LightSkyBlue"
                                          Duration="0:0:0.3"
                                />
                                      </Storyboard>
                                    </BeginStoryboard>
                                  </EventTrigger.Actions>
                                </EventTrigger>
                              </Grid.Triggers>

                            </Grid>

                          </Button>

                        </HierarchicalDataTemplate>
                      </ListBox.ItemTemplate>

                    </ListBox >
                  </Grid>
                </Grid>
              </Border>
              <!-- end Replacement List -->

              <GridSplitter Grid.Column="0"
              Grid.ColumnSpan="1"
              Grid.Row="1"
              HorizontalAlignment="Stretch"
              VerticalAlignment="Center"
              Height="4"
              ShowsPreview="True"
              Background="Transparent"
              />

              <!-- User Action List -->
              <Border Grid.Row="2" Margin="3 2 5 5" BorderBrush="Gray"
                      BorderThickness="1" CornerRadius="5" Background="{StaticResource MajorControlBackground}">
                <Grid DataContext="{Binding ElementName=_WizardWindow, Path=UserActionViewSource}" >

                  <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="*"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                  </Grid.RowDefinitions>

                  <TextBlock Grid.Row="0" Margin="3" FontFamily="Verdana" FontSize="14" FontWeight="SemiBold">
                    event stream:
                  </TextBlock>

                  <StackPanel Grid.Row="2" Margin="3" HorizontalAlignment="Left" Orientation="Horizontal">
                    <TextBlock VerticalAlignment="Center" FontFamily="Verdana" FontSize="12" Text="zoom "/>
                    <TextBlock VerticalAlignment="Center" FontFamily="Verdana" FontSize="8">+</TextBlock>
                    <Slider x:Name="UserActionReplacementListScale" VerticalAlignment="Center" Width="150"
                            Orientation="Horizontal" Minimum="0.2" Maximum="2.5" Value="1.0"
                      IsMoveToPointEnabled="False" LargeChange="0.1" IsDirectionReversed="True"></Slider>
                    <TextBlock VerticalAlignment="Center" FontFamily="Verdana" FontSize="8">-</TextBlock>
                  </StackPanel>

                  <Grid Grid.Row="1" Margin="3">

                    <ListBox
                      x:Name="_UserActionReplacementListBox"
                      ScrollViewer.HorizontalScrollBarVisibility="Disabled"
                      ScrollViewer.VerticalScrollBarVisibility="Visible"
                      ScrollViewer.CanContentScroll="True"
                      Margin="2"
                      IsSynchronizedWithCurrentItem="True"
                      SelectedIndex="0"
                      HorizontalAlignment="Stretch"
                      ItemsSource="{Binding}"
              >
                      <ListBox.ItemsPanel>
                        <ItemsPanelTemplate>
                          <WrapPanel HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
                                     FlowDirection="LeftToRight"
                                   >

                          </WrapPanel>
                        </ItemsPanelTemplate>
                      </ListBox.ItemsPanel>

                      <ListBox.ItemTemplate>

                        <HierarchicalDataTemplate>

                            <Grid x:Name="ItemGrid" ToolTip="{Binding Path=VisualToolTip}" Margin="4">
                              <Grid.LayoutTransform>
                                <ScaleTransform ScaleX="{Binding ElementName=UserActionReplacementListScale, Path=Value}" ScaleY="{Binding ElementName=UserActionReplacementListScale, Path=Value}">
                                </ScaleTransform>
                              </Grid.LayoutTransform>
                              <Grid.Background>
                                <SolidColorBrush Color="LightSkyBlue" x:Name="ItemGridBackground" 
                                                 Opacity="{Binding Path=Opacity}" 
                                                 />
                              </Grid.Background>
                              <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="Auto"/>
                              </Grid.ColumnDefinitions>



                              <Rectangle Grid.Column="0" Margin="3" Width="100" Height="80">
                                <Rectangle.Fill>
                                  <VisualBrush Visual="{Binding}" Stretch="Uniform"/>
                                </Rectangle.Fill>
                              </Rectangle>

                              <TextBlock TextWrapping="Wrap" HorizontalAlignment="Stretch"
                                         Grid.Column="1" VerticalAlignment="Center"
                                         Opacity="{Binding Path=Opacity}"
                                Margin="4" FontFamily="Verdana" FontSize="10" Text="{Binding Path=Description}"/>


                              <!--<Grid.Triggers>
                                <EventTrigger RoutedEvent="Grid.MouseEnter">
                                  <EventTrigger.Actions>
                                    <BeginStoryboard>
                                      <Storyboard>
                                        <ColorAnimation
                                          Storyboard.TargetProperty="Color"
                                          Storyboard.TargetName="ItemGridBackground"
                                          Duration="0:0:0.1"
                                >
                                          <ColorAnimation.To>
                                            --><!--To="LightSalmon"--><!--
                                            --><!--R:214  G:217  B:229=""--><!--
                                            --><!--I don't know why it says Color is invalid here, but it is valid and will run fine--><!--
                                            <Color A="255" R="214" G="217" B="229" />
                                          </ColorAnimation.To>
                                        </ColorAnimation>
                                      </Storyboard>
                                    </BeginStoryboard>
                                  </EventTrigger.Actions>
                                </EventTrigger>
                                <EventTrigger RoutedEvent="Grid.MouseLeave">
                                  <EventTrigger.Actions>
                                    <BeginStoryboard>
                                      <Storyboard>
                                        <ColorAnimation
                                          Storyboard.TargetProperty="Color"
                                          Storyboard.TargetName="ItemGridBackground"
                                          To="LightSkyBlue"
                                          Duration="0:0:0.3"
                                />
                                      </Storyboard>
                                    </BeginStoryboard>
                                  </EventTrigger.Actions>
                                </EventTrigger>
                              </Grid.Triggers>-->

                            </Grid>

                        </HierarchicalDataTemplate>
                      </ListBox.ItemTemplate>

                    </ListBox >
                  </Grid>
                </Grid>
              </Border>
              <!-- User Action List -->

            </Grid>

          </Grid>


        </Grid>
      </DockPanel>
    </Grid>
</Window>
